<template>
    <div>
     <h1>门店信息列表</h1>
     <a href="/AddMemberView">门店信息录入</a>
     <br>
      <a href="/ShowView">房号信息列表展示</a>
     <br>
     门店名称: <input type="text" v-model="find.name">
     门店状态： <select v-model="find.start">
        <option value="0">请选择</option>
        <option :value="1">开店</option>
        <option :value="2">闭店</option>
     </select>
     <input type="button" value="查询" @click="Show">
     <table class="table">
        <thead>
            <tr>
                <td>门店名称</td>
                <td>门店图片</td>
                <td>门店电话</td>
                <td>门店地址</td>
                <td>门店状态</td>
                <td>创建时间</td>
                <td>操作</td>
                
            </tr>
        </thead>
        <tbody>
            <tr v-for="a in data">
                 <td>{{a.name  }}</td>
                <td> <img :src="'https://localhost:7162'+a.img" style="height: 60px;width: 60px;"></td>
                <td>{{a.phone  }}</td>
                <td>{{ a.address }}</td>
                <td>{{a.start==1?"开店":"闭店"  }}</td>
                <td>{{moment (a.createTime).format("YYYY-MM-DD")  }}</td>
                <td><input type="button" value="修改" @click="UptMember(a.memberId)">
                <input type="button" value="修改状态" @click="UptStart(a.memberId)"></td>
            </tr>
        </tbody>
     </table>
     共{{swert.totalpage  }}页，共{{ swert.count }}行，当前第{{find.index  }}页，每页{{find.size  }}行
     <input type="button" value="首页" @click="Fanye(1)">
      <input type="button" value="上一页" @click="Fanye(find.index-1)">
      <input type="button" v-for="c in swert.totalpage" :value="c" @click="Fw(c)">
       <input type="button" value="下一页" @click="Fanye(find.index+1)">
        <input type="button" value="尾页" @click="Fanye(swert.totalpage)">
        <select v-model="find.size" @click="fs">
            <option :value="2">请选择</option>
             <option :value="3">每页三行</option>
              <option :value="5">每页五行</option>
               <option :value="7">每页七行</option>
        </select>
        跳转：
        <input type="number" v-model="tets">
        <input type="button" value="跳转" @click="Fanye(tets)">
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from "vue"
import axios from 'axios';
import moment from "moment";
import { useRouter } from "vue-router";
const router=useRouter()
const UptMember=(id:any)=>{
    router.push({path:"UptMemberView",query:{id:id}})
}
onMounted(()=>{
    Show()
})
const data=ref([{
     "memberId": 3,
      "name": "顺丰大酒店",
      "img": "",
      "phone": "16772888394",
      "address": "南阳市",
      "start": 2,
      "isDelete": true,
      "createId": 0,
      "createTime": "2025-06-16T08:36:58.208",
      "updateId": 0,
      "updateTime": "2025-06-16T08:36:58.208",
      "deleteId": 0,
      "deleteTime": "2025-06-16T08:36:58.208"
}])
const Fanye=(val:any)=>{
    if(val>=1 && val<=swert.value.totalpage){
        find.value.index=val
        Show()
    }
}
const fs=()=>{
    find.value.index=1
    Show()
}
const Fw=(val:any)=>{
       find.value.index=val
       Show()
}
const Show=()=>{
    axios.get("https://localhost:7162/api/Member/GetMember",{params:find.value}).then(res=>{
        data.value=res.data.data
        swert.value.count=res.data.count
        swert.value.totalpage=Math.ceil(swert.value.count/find.value.size)
    })
}
const find=ref({
    name:"",
    start:0,
    index:1,
    size:2
})
const swert=ref({
    count:0,
    totalpage:0
})
const UptStart=(id:any)=>{
    if(!confirm('确认修改吗？')){
        return;
    }
    axios.get("https://localhost:7162/api/Member/UptStart",{params:{id:id}}).then(res=>{
        if(res.data>0){
            alert('修改成功');
            Show()
        }
        else{
            alert('修改失败');
        }
    })
}
</script>

<style scoped>

</style>